import {Suspense} from 'react'
import{BrowserRouter,HashRouter,Navigate,Route,Routes} from 'react-router-dom'
import {RouterItem,RouterList} from '../util/type'
import routes from './routerConfig'
interface Props {
    
}
const Render=(arr:RouterItem[])=>{
    return arr.map((i,j)=>{
        return <Route key={j} 
        path={i.path}
        element={i.to?<Navigate to={i.to}></Navigate>:<i.element></i.element>
        }
        >
            {i.children&&Render(i.children)}
        </Route>
    })
}
const routerView = (props: Props) => {
    var mode=routes.mode
    var route=routes.route
    return (
       
            <Suspense fallback={<div>hahahah</div>}>
                {
                    mode==='history'?
                    <HashRouter>
                    <Routes>
                        {
                            Render(route)
                        }
                    </Routes>
                    </HashRouter>
                    :<BrowserRouter>
                    
                     <Routes>
                        {
                            Render(route)
                        }
                    </Routes>
                    </BrowserRouter>
                }
            </Suspense>
      
    )
}

export default routerView
